<template>
  <div style="width: 60%; margin: 30px auto">
    <div style="display: flex;font-size: 20px;justify-content: center">
      <div style="flex: 1">{{activityData.title}}</div>
      <img v-if="praiseData.length" src="@/assets/imgs/praise_done.png" style="width: 35px;height: 35px;cursor: pointer" @click="doPraise(0)">
      <img v-else src="@/assets/imgs/praise.png" style="width: 35px;height: 35px;cursor: pointer" @click="doPraise(1)">

    </div>
    <div style="margin-top: 10px;color: #666666">
      <span style="margin-right: 30px">点赞：{{activityData.count}}</span>
      <span>发布时间：{{activityData.time}}</span>
    </div>
    <div style="margin-top: 20px" v-html="activityData.content" class="w-e-text w-e-text-container"></div>
  </div>
</template>

<script>
import E from 'wangeditor'
export default {

  data() {
    return {
      user: JSON.parse(localStorage.getItem('xm-user') || '{}'),
      activityId:this.$route.query.id,
      activityData:{},
      praiseData:[]
    }
  },
  mounted() {
    this.loadActivity()
    this.checkPraise()
  },
  methods: {
    loadActivity(){
      this.$request.get('/activity/selectById/' + this.activityId).then(res =>{
        if (res.code === '200'){
          this.activityData = res.data
        }else {
          this.$message.error(res.msg)
        }
      })
    },
    checkPraise(){
      this.$request.get('/praise/selectAll',{
        params:{
          activityId:this.activityId,
          userId:this.user.id
        }
      }).then(res =>{
        if (res.code === '200'){
          this.praiseData = res.data
        }else {
          this.$message.error(res.msg)
        }
      })
    },
    doPraise(flag){
      this.$request.get('/praise/do',{
        params:{
          activityId:this.activityId,
          userId:this.user.id,
        }
      }).then(res => {
        if (res.code === '200'){
          if (flag === 1){
            this.$message.success("点赞成功")
          }else {
            this.$message.success("取消成功")
          }

          this.loadActivity()
          this.checkPraise()
        }else {
          this.$message.error(res.msg)
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
